<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单练习</title>
		<!--引入外部css文件-->
		<link rel="stylesheet" href="css/bootstrap.min.css" />
	</head>
	<body>
		<div class="container">
			<h3>学生信息管理系统</h3>

			<div class="form-group">
				<!--lable标签for是属性光标定位-->
				<label for="name">姓名:</label>
				<!--文本输入框,text是输入文字-->
				<input type="text" name="name" class="form-control" id=" name" placeholder="请输入大名" value="自己的身份证名字" />
				<!--placeholder后可以设置默认值value-->
			</div>
			<div class="form-group">
				<label for="age">年龄:</label>
				<!--number是输入数字，用户无法输入中文字符-->
				<input type="number" name="age" class="form-control" age" placeholder="请输入年龄" />
			</div>
			<div class="form-group">
				<label for="sex">性别:</label>
				<!--单选框radio，同名时只会选择一个，想默认单选加checked-->
				<div class="radio-inline">
					<input type="radio" name="sex" id="sex" checked="checked" />男
				</div>
				<div class="radio-inline">
					<input type="radio" name="sex" id="sex" />女
				</div>
			</div>
			<div class="form-group">
				<label for="hobby">爱好:（多选）</label>
				<!--多选框-->
					<div class="checkbox-inline">
						<input type="checkbox" name="hobby" id="hobby" />乒乓球
					</div>
					<div class="checkbox-inline">
						<input type="checkbox" name="hobby" id="hobby" />爬山
					</div>
					<div class="checkbox-inline">
						<input type="checkbox" name="hobby" id="hobby" />唱歌
					</div>
			</div>
			<div class="form-group">
				<label>学历:</label>
				<!--下拉框一般是单选select和option，用户选择后，表单提交的是value的值-->
				<!--想默认加selected-->
				<select name="edu" id="edu">
					<option selected="selected"style='display:none'></option>
					<option value="1">幼儿园</option>
					<option value="2">小学</option>
					<option value="3">初中</option>
					<option value="4">高中</option>
					<option value="5">大专</option>
					<option value="6">本科</option>
					<option value="7">研究生</option>
					<option value="8">硕士</option>
				</select>
			</div>
			<div class="form-group">
				<!--按钮写法1，input。2，botton-->
				<input class="btn btn-primary" type="button" name="submit" value="保存" />
				<button class="btn btn-danger" name="clear">取消</button>
			</div>

		</div>

	</body>
</html>
